<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>商品列表</title>
    <link rel="stylesheet" type="text/css" href="../../static/css/jquery.pagination.css">
    <link rel="stylesheet" type="text/css" href="../../static/css/top.css"/>
    <link rel="stylesheet" type="text/css" href="../../static/css/lunbo.css">
    <link rel="stylesheet" type="text/css" href="../../static/css/liebiao.css"/>
    <link rel="stylesheet" type="text/css" href="../../static/css/footer.css"/>
    <script src="../../static/js/jquery-1.8.3.min.js"></script>
    <script src="../../static/js/public.js"></script>
    <script src="../../static/js/liebiaoye.js"></script>
    <script src="../../static/js/main.js"></script>
    <script type="text/javascript" src="../../static/js/jquery.pagination.min.js"></script>
</head>

<body>
<!--顶部菜单有改动与首页的不一样，请单独调用-->
<div class="dy1">
    <div class="dy2">
        <ul class="dy3">
            <li><a href="{{ '/' }}">乐乐官网<br/>乐乐官网</a></li>
            <li><a href="#" id="diyunapp">商城APP<br/>商城APP</a></li>
        </ul>
        <a href="/user/my_shopcar" class="dy5">购物车</a>
        <ul class="dy4">
            {% if data.user_info %}
                <li><a href="/user/base_user" id="nick_name" style="color:skyblue">{{ data.user_info.nick_name }}</a>
                </li>
                <li><a href="/passport/logout" class="logout" style="color:skyblue">退出</a></li>
            {% else %}
                <li><a href="/passport/login">登录<br/>登录</a></li>
                <li><a href="/passport/yzzc">注册<br/>注册</a></li>
            {% endif %}

        </ul>
        <div class="dy6">
            <ul>
                {% for goods in data.shop_car.shop_goods %}
                    <li>
                        <b><img src="{{ goods.g_image }}"/></b>
                        <a href="/goods/{{ goods.g_id }}" class="dy7">{{ goods.g_name }}</a>
                        <a href="#" class="dy8">删除</a>
                    </li>
                {% endfor %}
            </ul>
        </div>
        <div class="dy9">
            <img src="../../static/img/phone.png"/>
        </div>
    </div>
</div>
<!--logo加时间加搜索框-->
<div class="dy10">
    <div class="dy11">
        <img src="../../static/img/logo.png"/>
    </div>
    <div class="dy13">
        <embed src="../../static/img/honehone_clock_wh.swf" style=" height:45px; width:120px"></embed>
    </div>
    <div class="dy12">
        <input type="text" id="find" value="搜索商品" onfocus="if(value=='搜索商品') {value=''}"
               onblur="if (value=='') {value='搜索商品/店铺'}"
               style="width:500px; height:36px; text-indent:12px; font-size:12px; color:#666; float:left">
        <input type="search" value="搜索"
               style=" cursor:pointer; width:70px; height:36px; float:right; text-align:center; background:#333;"
               class="sousuo">
    </div>
</div>
<!--全部商品分类-->
<div class="qbspfl">
    <div class="djfl">
        <a href="#" data-cid="0">全部商品分类</a>
    </div>
    <div class="morelist">
        {% for category in data.category_list %}
            <a href="#" data-cid="{{ category.c_id }}">
                {{ category.c_name }}
            </a>
        {% endfor %}
    </div>
</div>
<script>
    $(function () {
        $("#banner_menu_wrap").mouseleave(function () {
            $(this).hide()
            $("#big_banner_wrap").hide()
        });
        $(".djfl").mouseenter(function () {
            $("#big_banner_wrap").show()
            $("#banner_menu_wrap").show()
        });
    })

</script>
<!--banner轮播引入lunbo.css和daohang.js-->
<div id="big_banner_wrap" style=" position:absolute; top:177px; left:50%; margin-left:-613px">
    <ul id="banner_menu_wrap">
        <li class="active" img>
            <a>手机&nbsp;平板</a>
            <a class="banner_menu_i">&gt;</a>
            <div class="banner_menu_content" style="width: 600px; top: -20px;">
                <ul class="banner_menu_content_ul">
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                </ul>
                <ul class="banner_menu_content_ul">
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                </ul>
            </div>
        </li>
        <li>
            <a>电视&nbsp;盒子</a>
            <a class="banner_menu_i">&gt;</a>
            <div class="banner_menu_content" style="width: 600px; top: -62px;">
                <ul class="banner_menu_content_ul">
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                </ul>
                <ul class="banner_menu_content_ul">
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                </ul>
            </div>
        </li>
        <li>
            <a>路由器&nbsp;智能配件</a>
            <a class="banner_menu_i">&gt;</a>
            <div class="banner_menu_content" style="width: 900px; top: -104px;">
                <ul class="banner_menu_content_ul">
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                </ul>
                <ul class="banner_menu_content_ul">
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><<span>选购</span>/li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                </ul>
                <ul class="banner_menu_content_ul">
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                </ul>
            </div>
        </li>
        <li>
            <a>移动电源&nbsp;插线板</a>
            <a class="banner_menu_i">&gt;</a>
            <div class="banner_menu_content" style="width: 300px; top: -146px;">
                <ul class="banner_menu_content_ul">
                    <li>
                        <a><img src="../../static/img/headphone.jpg "></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                </ul>
            </div>
        </li>
        <li>
            <a>耳机&nbsp;音箱</a>
            <a class="banner_menu_i">&gt;</a>
            <div class="banner_menu_content" style="width: 300px; top: -188px;">
                <ul class="banner_menu_content_ul">
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                </ul>
            </div>
        </li>
        <li>
            <a>电池&nbsp;存储卡</a>
            <a class="banner_menu_i">&gt;</a>
            <div class="banner_menu_content" style="width: 300px; top: -230px;">
                <ul class="banner_menu_content_ul">
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                </ul>
            </div>
        </li>
        <li>
            <a>保护套&nbsp;后盖</a>
            <a class="banner_menu_i">&gt;</a>
            <div class="banner_menu_content" style="width: 300px; top: -272px;">
                <ul class="banner_menu_content_ul">
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                </ul>
            </div>
        </li>
        <li>
            <a>贴膜&nbsp;其它配件</a>
            <a class="banner_menu_i">&gt;</a>
            <div class="banner_menu_content" style="width: 600px; top: -314px;">
                <ul class="banner_menu_content_ul">
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                </ul>
                <ul class="banner_menu_content_ul">
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                </ul>
            </div>
        </li>
        <li>
            <a>箱包&nbsp;服装</a>
            <a class="banner_menu_i">&gt;</a>
            <div class="banner_menu_content" style="width: 300px; top: -356px;">
                <ul class="banner_menu_content_ul">
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                </ul>
            </div>
        </li>
        <li>
            <a>食品&nbsp;其它周边</a>
            <a class="banner_menu_i">&gt;</a>
            <div class="banner_menu_content" style="width: 300px; top: -398px;">
                <ul class="banner_menu_content_ul">
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                    <li>
                        <a><img src="../../static/img/headphone.jpg"></a><a>帝云耳机</a><span>选购</span></li>
                </ul>
            </div>
        </li>
    </ul>

</div>
<script src="../../static/js/daohang.js"></script>
<!--属性栏筛选 -->

<!--分类搜索-->
<div class="zhxlxp">
    <span style=" background:#000; color:#fff; margin-left:0;">排序方式</span>
    <a href="#">综合</a>
    <a href="#" title="7天销量降序排列">销量</a>
    <a href="#" title="上架时间降序排列">新品</a>
    <a href="#" title="销售价格降序排列">价格</a>
</div>
<!--商品列表-->
<div class="shopliebiao">
    <ul class="cog">
        {% for goods in data.click_goods_list %}
            <li>
                <a href="#" class="wocici">
                    <b>
                        <img src="{{ goods.g_image }}"/>
                    </b>
                    <h2>{{ goods.g_name }}</h2>
                    <p>{{ goods.g_content }}</p>
                    <span>{{ goods.g_price }}元</span>
                </a>
                <em class="wocaca">
                    <a href="#">{{ goods.merchant_name }}</a>
                    <a href="#" style=" border-right:hidden">联系卖家</a>
                </em>
            </li>
        {% endfor %}
    </ul>
    <div id="pagination" class="page" style="margin-left: 700px;"></div>
    <script>
        $(function () {
            $("#pagination").pagination({
                currentPage: 1,
                totalPage: 5,
                callback: function (current) {
                    window.location.href = '/goods/commodity?p=' + current
                }
            });
        });
    </script>
</div>


<div class="footer">
    <div class="box" style=" width:1226px; margin:0 auto">
        <ul class="lian">
            <li>
                <p><img src="../../static/img/fot.png">新手指南</p>
                <a href="#">账户注册</a>
                <a href="#">购物流程</a>
                <a href="#">网站地图</a>
            </li>
            <li>
                <p><img src="../../static/img/fot1.png">支付方式</p>
                <a href="#">货到付款</a>
                <a href="#">在线支付</a>
                <a href="#">礼品卡及账户余额</a>
                <a href="#">其他支付方式</a>
            </li>
            <li>
                <p><img src="../../static/img/fot2.png">配送说明</p>
                <a href="#">配送运费</a>
                <a href="#">配送时间</a>
            </li>
            <li>
                <p><img src="../../static/img/fot3.png">售后服务</p>
                <a href="#">退换货政策</a>
                <a href="#">退换货办理流程</a>
                <a href="#">退换货网上办理</a>
                <a href="#">退款说明</a>
            </li>
            <li>
                <p><img src="../../static/img/fot4.png">关于我们</p>
                <a href="#">公司简介</a>
                <a href="#">合作专区</a>
                <a href="#">联系我们</a>
                <a href="#">友情链接</a>
            </li>
            <li>
                <p><img src="../../static/img/fot5.png">帮助中心</p>
                <a href="#">找回密码</a>
                <a href="#">邮件订阅</a>
                <a href="#">产品册订阅</a>
                <a href="#">隐私声明</a>
            </li>
        </ul>
        <ul class="adv">
            <li><img src="../../static/img/adv.png">正品保障</li>
            <li><img src="../../static/img/adv1.png">免运费</li>
            <li><img src="../../static/img/adv2.png">送货上门</li>
            <li style="border-right:none;"><img src="../../static/img/adv3.png">实物拍摄</li>
        </ul>
        <p class="ad">地址：山东省济南市天桥区历山北路黄台电子商务产业园1020室 &nbsp;&nbsp;&nbsp;邮箱：xgm@8and9.com.cn &nbsp;&nbsp;&nbsp;邮编:210008
            &nbsp;&nbsp;&nbsp;电话:025-83218155</p>
        <p class="ad">Copyright © 2010 - 2013, 版权所有 SHUIGUO.COM &nbsp;&nbsp;&nbsp;苏ICP备10088888号-1</p>
    </div>
</div>

</body>
</html>    
           
    
               
            
        
             
                
            
                    
        
            	
            
                  
          
 

    
    		
        